<script>
import { createViewer } from '@paodingai/pdflux-pdf-viewer';

export default {
  name: 'DocViewer',
  props: ['viewerOptions'],
  data() {
    return {
      app: null,
    };
  },
  mounted() {
    this.app = createViewer(this.$refs.elementRef, this.viewerOptions);
  },
  beforeDestroy() {
    this.app.destroy();
  },
};
</script>

<template>
  <div class="doc-viewer" ref="elementRef"></div>
</template>

<style src="@paodingai/pdflux-pdf-viewer/dist/style.css"></style>

<style scoped>
.doc-viewer {
  height: 100%;
}
</style>
